<template>
  <el-form
    ref="dynForm"
    :inline="isInline"
    :model="infoForm"
    :disabled="formDisable || false"
    :label-width="labelWidth || '120px'"
    :rules="rules"
    v-bind="$attrs"
  >
    <slot name="prepend"/>
    <!-- :label-width="item.labelwidth || '120px'" -->
    <template v-for="(item, index) of searchTags">
      <el-form-item
        v-if="item.vif?item.vif():true"
        :key="index"
        :label="item.label"
        :label-width="item.labelWidth"
        :prop="item.prop"
        :style="{width: item.width}"
        :class="item.className"
      >
        <component
          :is="item.tag"
          v-model="infoForm[item.prop]"
          :select-item="selectList[item.prop]"
          :item="item"/>
      </el-form-item>
    </template>
    <slot/>
  </el-form>
</template>
<script>
import DynInput from './components/ElInput'
import DynSelect from './components/ElSelect'
import Dyndaterange from './components/ElDaterange'
import Dyndate from './components/Eldate'
import DynSwitch from './components/ElSwitch'
import DynTextarea from './components/ElTextarea'
import DynCheckbox from './components/ElCheckbox'
import DynInputNumber from './components/ElinputNumber'
import Dyntimerange from './components/ElTimerange'
import DynRadio from './components/ElRadio'
import DynTimePicker from './components/ElTimePicker'
export default {
  name: 'DynForm',
  components: { DynInput, DynSelect, Dyndaterange, Dyndate, Dyntimerange, DynRadio,
    DynSwitch, DynTextarea, DynCheckbox, DynInputNumber, DynTimePicker },
  props: {
    infoForm: {
      type: Object,
      default: () => ({})
    },
    selectList: {
      type: Object,
      default: () => ({})
    },
    formDisable: {
      type: Boolean,
      default: false
    },
    labelWidth: {
      type: String,
      default: ''
    },
    searchTags: {
      type: Array,
      default: () => ([])
    },
    rules: {
      type: Object,
      default: () => ({})
    },
    isInline: {
      type: Boolean,
      default: true
    }
  }
}
</script>
